<template>
  <div style="display: flex;align-items: center;font-size: 14px; margin-left: 6px;">
    <i
      :class="state === 'GOOD' ?'el-icon-success' :state === 'BAD' ?'el-icon-error' : 'el-icon-warning'"
      :style="'color:' + (state === 'GOOD' ? '#67c23a' : state === 'BAD' ?'#ff7676' :'#ebb563') + ';'"
    />
    <span style="margin-left: 3px;">{{ title }}</span>
  </div>
</template>

<script>
export default {
  props: {
    title: {
      type: String,
      default: ''
    },
    state: {
      type: String,
      default: 'GOOD'
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
